// import React from 'react';
import React, { Suspense, lazy } from 'react';


// import { BrowserRouter as Router, Route, Switch, Link } from 'react-router-dom';
import { HashRouter as Router, Route, Switch, Link } from 'react-router-dom';
const TopHeader = lazy(() => import('@src/components/LoginHeader'));

const IndexView = lazy(() => import('@pages/test/Index'));
const ZeroView = lazy(() => import('@pages/test/Zero'));
const OneView = lazy(() => import('@pages/test/One'));
const TwoView = lazy(() => import('@pages/test/Two'));
const ThreeView = lazy(() => import('@pages/test/Three'));
const FourView = lazy(() => import('@pages/test/Four'));
const FiveView = lazy(() => import('@pages/test/Five'));
//loginMask 选直接到index.html写一下样式哈

const AppRouter = () => (
    <Router>

        <Suspense fallback={<div className="loginMask">正在拼命加载...</div>}>
            <ul>
                <li>
                    <Link path="/One" />
                    <Link path="/Two" />
                </li>
            </ul>
            <Switch>
                <Route exact path="/Zero" component={ZeroView} />
                <Route exact path="/One" component={OneView} />
                <Route exact path="/Two" component={TwoView} />
                <Route exact path="/Three" component={ThreeView} />
                <Route exact path="/Four" component={FourView} />
                <Route exact path="/Five" component={FiveView} />
                <Route path="/" component={IndexView} />
            </Switch>
        </Suspense>
    </Router>
);

export default AppRouter;